<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1 , user-scalable=no">
    <title>微电影</title>
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resource/static/base/images/logo.png">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/bootstrap-movie.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/animate.css">
    <style>
        .navbar-brand>img {
            display: inline;
        }

    </style>
    <style>
        .media{
            padding:3px;
            border:1px solid #ccc
        }

    </style>
</head>

<body>
<!--导航-->
<c:if test="${sessionScope.userName!=null}">
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a href="index.jsp" class="navbar-brand" style="width:250px;">
                    <img src="${pageContext.request.contextPath}/resource/static/base/images/logo.png"
                         style="height:30px;">&nbsp;微电影
                </a>
            </div>
            <!--小屏幕导航按钮和logo-->
            <!--导航-->
            <div class="navbar-collapse collapse">
                <form class="navbar-form navbar-left" role="search" style="margin-top:18px;">
                    <div class="form-group input-group">
                        <input type="text" class="form-control" placeholder="请输入电影名！">
                        <span class="input-group-btn">
                        <a class="btn btn-default" href="search.jsp"><span class="glyphicon glyphicon-search"></span>&nbsp;搜索</a>
                    </span>
                    </div>
                </form>
                <ul class="nav navbar-nav navbar-right">
                    <li>
                        <a class="curlink" href="index.jsp"><span class="glyphicon glyphicon-film"></span>&nbsp;电影</a>
                    </li>
                    <li>
                        <a class="curlink" href="/person/layout"><span class="glyphicon glyphicon-log-out"></span>&nbsp;退出</a>
                    </li>
                    <li>
                        <a class="curlink" href="/person/toUserInformation"><span
                                class="glyphicon glyphicon-user"></span>&nbsp;${sessionScope.userName}</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
</c:if>
<!--导航-->
<!--内容-->
<div class="container" style="margin-top:120px">
    <div class="row">
        <div class="col-md-4 col-md-offset-4">
            <div class="panel panel-success">
                <div class="panel-heading">
                    <h3 class="panel-title"><span class="glyphicon glyphicon-plus"></span>&nbsp;用户注册</h3>
                </div>
                <div class="panel-body">
                    <form id="register-form">
                            <div class="form-group">
                                <label for="input_name"><span class="glyphicon glyphicon-user"></span>&nbsp;昵称</label>
                                <input id="input_name" class="form-control input-lg" placeholder="昵称" name="name" type="text" autofocus>
                            </div>
                            <div class="col-md-12" id="error_name"></div>
                            <div class="form-group">
                                <label for="input_email"><span class="glyphicon glyphicon-envelope"></span>&nbsp;邮箱</label>
                                <input id="input_email" class="form-control input-lg" placeholder="邮箱" name="email" type="email" autofocus>
                            </div>
                            <div class="col-md-12" id="error_email"></div>
                            <div class="form-group">
                                <label for="input_phone"><span class="glyphicon glyphicon-phone"></span>&nbsp;手机</label>
                                <input id="input_phone" class="form-control input-lg" placeholder="手机" name="phone" type="text" autofocus>
                            </div>
                            <div class="col-md-12" id="error_phone"></div>
                            <div class="form-group">
                                <label for="input_password"><span class="glyphicon glyphicon-lock"></span>&nbsp;密码</label>
                                <input id="input_password" class="form-control input-lg" placeholder="密码" name="password" type="password" value="">
                            </div>
                            <div class="col-md-12" id="error_password"></div>
                            <div class="form-group">
                                <label for="input_repassword"><span class="glyphicon glyphicon-lock"></span>&nbsp;确认密码</label>
                                <input id="input_repassword" class="form-control input-lg" placeholder="确认密码" name="repassword" type="password" value="">
                            </div>
                            <div class="col-md-12" id="error_repassword"></div>
                            <input type="submit" value="注册" class="btn btn-lg btn-success btn-block">
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<!--内容-->
<!--底部-->
<footer>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <p>
                    ©&nbsp;2017&nbsp;flaskmovie.imooc.com&nbsp;京ICP备 13046642号-2
                </p>
            </div>
        </div>
    </div>
</footer>
<!--底部-->
<script src="${pageContext.request.contextPath}/resource/static/base/js/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/base/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/base/js/jquery.singlePageNav.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/base/js/wow.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/lazyload/jquery.lazyload.min.js"></script>
<script src="//cdn.bootcss.com/holder/2.9.4/holder.min.js"></script>
<script>
    $(document).ready(
        function () {
            $("#register-form").on("submit", function () {
                var name= $("#input_name").val();
                var email= $("#input_email").val();
                var phone= $("#input_phone").val();
                var password= $("#input_password").val();
                var repassword= $("#input_repassword").val();
                var rdata={
                    "personName":name,
                    "personEmail":email,
                    "personPhone":phone,
                    "personPassword":password,
                    "personRePassword":repassword,
                    "personRole":0
                }
                $.ajax({
                    url:"/person/doRegister",
                    data:rdata,
                    type:"post",
                    dataType:"json",
                    success:function (res) {
                        alert(res.msg);
                        if (res.code=="200"){
                            window.location="/person/tologin"
                        }
                    },
                    error:function (e1,e2,e3) {
                        console.log(e1);
                        console.log(e2);
                        console.log(e3);
                    }
                })
                return false;
            })
        }
    )
</script>
</body>
</html>
